{extend name="main/index" /}
{block name="main"}
<!-- Start right content -->
<div class="content-page">
    <!-- ============================================================== -->
    <!-- Start Content here -->
    <!-- ============================================================== -->
    <div class="content">
        <!-- Page Heading Start -->
        <div class="page-heading">
            <h1><i class='fa fa-table'></i>前台用户</h1>
            <h3>Basic & Simple Sortable Tables</h3></div>
        <!-- Page Heading End-->                <!-- Your awesome content goes here -->
        <div class="row">

            <div class="col-md-12">
                <div class="widget">
                    <div class="widget-header transparent">
                        <h2><strong>前台用户表</strong></h2>
                        <div class="additional-btn">
                            <a href="#" class="hidden reload"><i class="icon-ccw-1"></i></a>
                            <a href="#" class="widget-toggle"><i class="icon-down-open-2"></i></a>
                            <a href="#" class="widget-close"><i class="icon-cancel-3"></i></a>
                        </div>
                    </div>
                    <div class="widget-content">
                        <div class="table-responsive">
                            <table data-sortable class="table">
                                <thead>
                                <tr>
                                    <th>ID</th>
                                    <th style="width: 30px" data-sortable="false"><input type="checkbox">
                                    <th>姓名</th>
                                    <th>地址</th>
                                    <th>性别</th>
                                    <th>电话</th>
                                    <th data-sortable="false">年龄</th>
                                    <!-- <th>Status</th> -->
                                    <th data-sortable="false">操作</th>

                                </tr>
                                </thead>
                                 {volist name="list" key="k" id="v" }
                                
                                <tr>
                                    <td>{$v['id']}</td>
                                    <td><input type="checkbox" class="rows-check"></td>
                                    <td><strong>{$v['name']}</strong></td>
                                    <td>{$v['province']}</td>
                                    <td>
                                        {switch name="$v['sex']"}
                                        {case value="0"}女{/case}
                                        {case value="1"}男{/case}
                                        {default /}  未知
                                        {/switch}
                                    </td>
                                    <td>{$v['tel']}</td>
                                    <td>{$v['age']}</td>
                                    
                                     <td>
                                        <button class="btn" value="{$v['status']}" data-id="{$v['id']}">{$v['status']==0?'激活':'禁用'}</button>
                                        

                                    </td>
                                    
                                </tr>
                                
                                {/volist}
                                
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
        
      

        <!-- Footer Start -->
        <footer>
            Huban Creative &copy; 2014
            <div class="footer-links pull-right">
                <a href="#">About</a><a href="#">Support</a><a href="#">Terms of Service</a><a href="#">Legal</a><a
                    href="#">Help</a><a href="#">Contact Us</a>
            </div>
        </footer>
        <!-- Footer End -->
    </div>
    <!-- ============================================================== -->
    <!-- End content here -->
    <!-- ============================================================== -->

</div>
<!-- End right content -->
{/block}


{block name="myjs"}
<script>


        // 修改用户列表状态按钮
        $(function () {
            $('.btn').click(function () {
                var value = $(this).text()=='激活'?0:1;
                var id = $(this).attr('data-id');
                updateAjax(value,id,this);
            });
        });

        function updateAjax(value,id,obj) {
            // console.log(value);
            // console.log(id);
            // console.log(obj);
            $.ajax({
                type:'get',
                url:'/done/'+value,
                data:{id:id},
                dataType:'json',
                success:function (data) {
                    $(obj).text(data.datas);
                    window.location.href='/iindex';

                },
                error:function (data) {
                    console.log(data);
                    window.location.href='/iindex';
                    
                }
            });
        }
       

</script>
{/block}